<template>
	<view class="container">

		<!-- 支付成功提示文字 -->
		<view class="success-message">
			<text class="title">支付成功</text><br>
			<text class="amount">支付金额：278.00元</text>
		</view>

		<!-- 支付完成按钮操作 -->
		<view class="action-buttons">
			<button class="primary-button" @click="goHome">返回首页</button>
			<button class="secondary-button" @click="otherServices">继续其他操作</button>
		</view>
	</view>
</template>

<script>
	export default {
		methods: {
			goHome() {
				// 跳转到首页
				uni.switchTab({
					url: '/pages/index/index' // 假设首页路径为 /pages/index/index
				});
			},
			otherServices() {
				// 处理其他操作，跳转到其他页面
				uni.navigateTo({
					url: '/pages/services/services' // 假设这是另一个服务操作页面
				});
			}
		}
	};
</script>

<style scoped>
	.container {
	  padding: 20px;
	  background-color: #fff;
	  height: 100vh;
	  display: flex;
	  flex-direction: column;
	  justify-content: space-between;
	}
	
	.navbar {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 10px 0;
	}

	.title {
		flex: 1;
		text-align: center;
		font-size: 16px;
		font-weight: bold;
	}


	/* 支付成功信息 */
	.success-message {
		text-align: center;
		margin-bottom: 20px;
	}

	.title {
		font-size: 24px;
		color: #4CAF50;
		margin-bottom: 10px;
	}

	.amount {
		font-size: 32px;
		color: #333;
	}

	/* 按钮操作区 */
	.action-buttons {
		display: flex;
		flex-direction: column;
		width: 100%;
		max-width: 300px;
		top:-80px;
	}

	.primary-button {
		background-color: #4CAF50;
		color: white;
		font-size: 18px;
		padding: 10px 20px;
		border-radius: 5px;
		text-align: center;
		margin-bottom: 10px;
	}

	.secondary-button {
		background-color: #f1f1f1;
		color: #333;
		font-size: 16px;
		padding: 10px 20px;
		border-radius: 5px;
		text-align: center;
	}
</style>